<script setup lang="ts">
import {RegisterRate} from "~/api/registerApi.ts";
import {batchChange, clearInfo} from "~/api/iaaApi.ts";

const apiPrefix = 'iaaControl'
const { state, query } = useTable({
  apiPrefix,
  searchColumn: [],
  queryApi: (params?: any,pageParam?:any) => {
    Object.assign(pageParam,params)
    return useGet(`/${state.apiPrefix}/allInfo`,pageParam)
  },
  afterQuery: (res) => {
    let bfDatesSet = new Set<string>()
    let linkCodesSet = new Set<string>()
    res.list.forEach((item:any) => {
      item.id = item.linkCode + item.bfDate
      linkCodesSet.add(item.linkCode)
      bfDatesSet.add(item.bfDate)
    })
    bfDates = Array.from(bfDatesSet)
    linkCodes = Array.from(linkCodesSet)
    return res
  },
  _pagination:{
    column: '',
    pageSize: 999,
    pageSizeOptions: ['999']
  },
})
const {formState,handleEdit,handleOk,handleCancel} = useForm({
  apiPrefix,query
})
let iaaStatus = ["AD","LC"] as string[]

const columns = shallowRef([
  {
    title: '链接码',
    dataIndex: 'linkCode',
  },
  {
    title: '日期',
    dataIndex: 'bfDate'
  },
  {
    title: '当日备份留存次数',
    dataIndex: 'lcCount',
  },
  {
    title: '当日备份看广告次数',
    dataIndex: 'adCount'
  },
  {
    title: '当日总留存次数',
    dataIndex: 'sumLcCount',
  },
  {
    title: '当日总看广告次数',
    dataIndex: 'sumAdCount'
  },
  // {
  //   title: '最大看广告次数',
  //   dataIndex: 'useEmailType',
  // },
  {
    title: '当日备份状态',
    dataIndex: 'status'
  },
  {
    title: '操作',
    dataIndex: 'action'
  }
])



function handleDelete(record){
  clearInfo(record).then(()=>{
    query()
  })
}
let bfDates = [] as string []
let batchModalVisible = ref(false)
let batchModalForm = ref({
  status: 'AD',
  bfDate: ''
})
function showBatchModalForm(){
  batchModalVisible.value = true
}
let linkCodes = [] as string []
function handleBatchChange(){
  // console.log(batchModalForm.value)
  batchChange(batchModalForm.value)
  batchModalVisible.value = false
  query()

}
let searchKey = ref('')
function handleSearch(_event:any,reset?:Boolean){
  if(reset){
    searchKey.value = ''
  }
  state.queryParams = {linkCode:searchKey.value}
  // console.log(state.queryParams)
  query()
}
</script>

<template>
  <a-card>
<!--    <template #extra>-->

<!--      <a-space size="large">-->
      <a-row>
        <a-col :span="6">
          <a-input-group compact>
            <a-select v-model:value="searchKey" style="width: 30%">
              <a-select-option :value="l" v-for="l in linkCodes">{{ l }}</a-select-option>
            </a-select>
            <a-button type="primary" @click="handleSearch">搜索</a-button>
          </a-input-group>
        </a-col>
        <a-col :span="2" :pull="3">
          <a-button type="primary" @click="(e)=>handleSearch(e,true)">
            重置
          </a-button>
        </a-col>
        <a-col :span="2" :push="14">
          <a-button type="primary" @click="showBatchModalForm">
            批量修改
          </a-button>
        </a-col>

      </a-row>


<!--      </a-space>-->
<!--    </template>-->

    <a-table
        row-key="id" :row-selection="state.rowSelections" :loading="state.loading" :columns="columns"
        :data-source="state.dataSource" :pagination="state.pagination"
    >
      <template #bodyCell="scope">
        <template v-if="scope?.column?.dataIndex === 'action'">
          <div flex gap-2>
            <a-button type="link" @click="handleEdit(scope?.record as RegisterRate)">
              编辑
            </a-button>
            <a-popconfirm
                title="确定删除该条数据？" ok-text="确定" cancel-text="取消"
                @confirm="handleDelete(scope?.record as RegisterRate)"
            >
              <a-button type="link">
                删除
              </a-button>
            </a-popconfirm>
          </div>
        </template>
        <template v-if="scope?.column?.dataIndex === 'status'">
          <div v-if="scope?.record.status == 'AD'">
            看广告
          </div>
          <div v-if="scope?.record.status == 'LC'">
            仅留存
          </div>
        </template>
      </template>
    </a-table>
  </a-card>
  <a-modal v-model:visible="formState.formVisible" :title="formState.isUpdate?'编辑':'新增'" @ok="handleOk" @cancel="handleCancel">
    <a-form ref="formRef" :model="formState.formData" class="w-full" :label-col="{ style: { width: '150px' } }" :wrapper-col="{ span: 12 }">
      <a-form-item name="linkCode" label="链接码" :rules="[{ required: true, message: '请输入链接码' }]">
        <a-input-number v-model:value="formState.formData.linkCode" :min="5" :max="99999" placeholder="请输入链接码" />
      </a-form-item>
      <a-form-item name="status" label="任务状态" :rules="[{ required: true, message: '任务状态' }]">
        <a-select
            ref="select"
            v-model:value="formState.formData.status"
            style="width: 160px"
        >
          <a-select-option v-for="item in iaaStatus" :value="item">
            <div v-if="item == 'AD'">
              看广告
            </div>
            <div v-if="item == 'LC'">
              仅留存
            </div>
          </a-select-option>
        </a-select>
      </a-form-item>

    </a-form>
  </a-modal>
  <a-modal v-model:visible="batchModalVisible" title="批量改状态" @ok="handleBatchChange">
    <a-form ref="formRef" :model="batchModalForm" class="w-full" :label-col="{ style: { width: '150px' } }" :wrapper-col="{ span: 12 }">
      <a-form-item name="bfDate" label="备份日期" :rules="[{ required: true, message: '备份日期' }]">
        <a-select
            ref="select"
            v-model:value="batchModalForm.bfDate"
            style="width: 120px"

        >
          <a-select-option :value="d" v-for="d in bfDates">{{ d }}</a-select-option>

        </a-select>
      </a-form-item>
      <a-form-item name="status" label="操作类型" :rules="[{ required: true, message: '操作类型' }]">
        <a-select
            ref="select"
            v-model:value="batchModalForm.status"
            style="width: 160px"
        >
          <a-select-option  value="AD">
            改为看广告
          </a-select-option>>
          <a-select-option value="LC">
            改为仅留存
          </a-select-option>>
          <a-select-option  value="DEL">
            删除此时间点前备份
          </a-select-option>
        </a-select>
      </a-form-item>

    </a-form>

  </a-modal>
</template>

<style scoped lang="less">

</style>